const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const src = path.resolve(__dirname, 'src');
const publish = path.resolve(__dirname, 'publish');

const config = {
  context: src,
  entry: src,
  output: {
    path: publish,
    publicPath: '/',
    filename: './js/[name].js'
  },
  module: {
     rules: [{
      test: /\.style$/,
      use: ['style-loader']
    }, {
      test: /\.css$/,
      use: ExtractTextPlugin.extract({
        fallback: 'style-loader',
        use: [
          'css-loader',
          'autoprefixer-loader'
        ]
      })
    }, {
      test: /\.scss$/,
      use: ExtractTextPlugin.extract({
        fallback: 'style-loader',
        use: [
          'css-loader',
          'autoprefixer-loader',
          'sass-loader'
        ]
      })
    }, {
      test: /\.js[x]?$/,
      exclude: /(node_modules)/,
      loader: 'babel-loader',
      query: {
        presets: [ "es2015", "stage-2", "react" ]
      }
    }]
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({
    // 最紧凑的输出
      beautify: false,
      // 删除所有的注释
      comments: false,
      compress: {
        // 在UglifyJs删除没有用到的代码时不输出警告
        warnings: false,
        // 删除所有的 `console` 语句
        // 还可以兼容ie浏览器
        drop_console: true,
        // 内嵌定义了但是只用到一次的变量
        collapse_vars: true,
        // 提取出出现多次但是没有定义成变量去引用的静态值
        reduce_vars: true,
      }
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      filename: 'vendors.[hash].js',
      children: true,
      minChunks: 2
    }),
    new ExtractTextPlugin('./css/[name].css'),
    new HtmlWebpackPlugin({
      title: 'My App',
      template: [src, 'template', 'publish', 'index.ejs'].join('/'),
      inject: false
    })
  ]
};
module.exports = config;
